<template>
	<div class="app-container">
		<div v-if="['yw2', 'yw1', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))" class="header">
			<el-divider direction="vertical" style="border: 3px #f56c6c solid; height: 20px" />业务看板
		</div>
		<BaseTable
			v-if="['yw2', 'yw1', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))"
			:columns="columnsyw"
			:dataList="dataListyw"
			noSelection>
			<template #customerCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToCustomer(row)">{{ row.customerCount }}</span>
			</template>
			<template #createUserCode="{ row }">
				<span>业务员</span>
			</template>
			<template #projectCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToProject(row)">{{ row.projectCount }}</span>
			</template>
			<template #treatyTotalMoney="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToHe(row)">{{ row.treatyTotalMoney }}</span>
			</template>
		</BaseTable>
		<div v-if="['sj1', 'sj2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))" class="header">
			<el-divider direction="vertical" style="border: 3px #f56c6c solid; height: 20px" />技术看板
		</div>
		<BaseTable
			v-if="['sj1', 'sj2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))"
			:columns="columnssj"
			:dataList="dataListsj"
			noSelection>
			<template #action="{ row }">
				<el-button link type="primary" @click="linkToWorkQuailty(row)">查看</el-button>
			</template>
			<template #createUserCode="{ row }">
				<span>技术员</span>
			</template>
			<template #projectCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToProject(row)">{{ row.projectCount }}</span>
			</template>
		</BaseTable>
		<div v-if="['cg1', 'cg2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))" class="header">
			<el-divider direction="vertical" style="border: 3px #f56c6c solid; height: 20px" />采购看板
		</div>
		<BaseTable
			v-if="['cg1', 'cg2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))"
			:columns="columnscg"
			:dataList="dataListcg"
			noSelection>
			<template #customerCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToCustomers(row)">{{ row.customerCount }}</span>
			</template>
			<template #createUserCode="{ row }">
				<span>采购员</span>
			</template>
			<template #projectCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToProject(row)">{{ row.projectCount }}</span>
			</template>
			<template #summarySum="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToExecutionCost(row)">{{ row.summarySum }}</span>
			</template>
			<template #projectProfitMargin="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToGrossMargin(row)">{{ row.projectProfitMargin }}%</span>
			</template>
		</BaseTable>
		<div v-if="['gc1', 'gc2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))" class="header">
			<el-divider direction="vertical" style="border: 3px #f56c6c solid; height: 20px" />工程看板
		</div>
		<BaseTable
			v-if="['gc1', 'gc2', 'jl', 'admin'].some((e) => userStore.$state.roles.includes(e))"
			:columns="columnsgc"
			:dataList="dataListgc"
			noSelection>
			<template #customerCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToCustomers(row)">{{ row.customerCount }}</span>
			</template>
			<template #createUserCode="{ row }">
				<span>工程员</span>
			</template>
			<template #projectCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToProjectData(row)">{{ row.projectCount }}</span>
			</template>
			<template #logCount="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToWorkLog(row)">{{ row.logCount }}</span>
			</template>
			<template #projectDataLogsNumber="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="linkToProjectResource(row)">{{ row.projectDataLogsNumber }}</span>
			</template>
		</BaseTable>
		<div style="height: 30px"></div>
	</div>
</template>
<script setup name="boardIndex">
import BaseTable from '@/components/BaseTable'
import { ywlist, sjlist, cglist, gclist } from '@/api/board/index'
import useUserStore from '@/store/modules/user'
const userStore = useUserStore()

const { proxy } = getCurrentInstance()
const { problem_status } = proxy.useDict('problem_status')
const router = useRouter()
const columnsyw = ref([
	{ key: 1, label: `姓名`, prop: 'nickname', type: 'text', visible: true },
	{ key: 2, label: `角色`, prop: 'createUserCode', type: 'custom', visible: true },
	{ key: 3, label: `项目数量`, prop: 'projectCount', type: 'custom', visible: true },
	{ key: 4, label: `客户数量`, prop: 'customerCount', type: 'custom', visible: true },
	{ key: 5, label: `合同金额`, prop: 'treatyTotalMoney', type: 'custom', visible: true }
])
const dataListyw = ref([])
const columnssj = ref([
	{ key: 1, label: `姓名`, prop: 'nickname', type: 'text', visible: true },
	{ key: 2, label: `角色`, prop: 'createUserCode', type: 'custom', visible: true },
	{ key: 3, label: `服务项目数量`, prop: 'projectCount', type: 'custom', visible: true },
	{ key: 4, label: `质量评价`, prop: 'action', type: 'custom', visible: true }
])
const dataListsj = ref([])
const columnscg = ref([
	{ key: 1, label: `姓名`, prop: 'nickname', type: 'text', visible: true },
	{ key: 2, label: `角色`, prop: 'createUserCode', type: 'custom', visible: true },
	{ key: 3, label: `服务项目数量`, prop: 'projectCount', type: 'custom', visible: true },
	{ key: 4, label: `服务客户数量`, prop: 'customerCount', type: 'custom', visible: true },
	{ key: 5, label: `执行成本汇总`, prop: 'summarySum', type: 'custom', visible: true },
	{ key: 6, label: `毛利率汇总`, prop: 'projectProfitMargin', type: 'custom', visible: true }
])
const dataListcg = ref([])
const columnsgc = ref([
	{ key: 1, label: `姓名`, prop: 'nickname', type: 'text', visible: true },
	{ key: 2, label: `角色`, prop: 'createUserCode', type: 'custom', visible: true },
	{ key: 3, label: `服务项目数量`, prop: 'projectCount', type: 'custom', visible: true },
	{ key: 4, label: `服务客户数量`, prop: 'customerCount', type: 'custom', visible: true },
	{ key: 5, label: `工程日志数量`, prop: 'logCount', type: 'custom', visible: true },
	{ key: 6, label: `项目资料`, prop: 'projectDataLogsNumber', type: 'custom', visible: true }
])

const dataListgc = ref([])
const search = () => {}
search()
const address = ref()
const reset = () => {
	for (let item in queryData) {
		queryData[item] = ''
	}
	queryData.pageNum = 1
	queryData.pageSize = 1000
	address.value[0]()
	search()
}

// 跳转到项目列表
const linkToProject = (row) => {
	router.push({
		path: '/project/projectManage',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到客户列表
const linkToCustomer = (row) => {
	router.push({
		path: '/customer/customerManage',
		query: { createUserCode: row.createUserCode, resource: 1 }
	})
}
// 跳转到客户展示列表
const linkToCustomers = (row) => {
	router.push({
		path: '/customer/customerManageShow',
		query: { createUserCode: row.createUserCode, resource: 1 }
	})
}
// 跳转到合同列表
const linkToHe = (row) => {
	router.push({
		path: '/project/contractManage',
		query: { createUserCode: row.createUserCode, resource: 1 }
	})
}
// 跳转到工作质量评价
const linkToWorkQuailty = (row) => {
	router.push({
		path: '/board/workQuailty',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到执行成本看板
const linkToExecutionCost = (row) => {
	router.push({
		path: '/board/executionCost',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到毛利率详情
const linkToGrossMargin = (row) => {
	router.push({
		path: '/board/grossMargin',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到项目工期
const linkToProjectData = (row) => {
	router.push({
		path: '/board/projectData',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到项目资料
const linkToProjectResource = (row) => {
	router.push({
		path: '/board/projectResource',
		query: { createUserCode: row.createUserCode }
	})
}
// 跳转到工程日志数量
const linkToWorkLog = (row) => {
	router.push({
		path: '/board/workLog',
		query: { createUserCode: row.createUserCode }
	})
}
const toDetail = (id) => {
	router.push({
		path: '/question/questionDetail',
		query: { id: id }
	})
}
const toEdit = (id) => {
	router.push({
		path: '/question/questionEdit',
		query: { id: id }
	})
}
ywlist().then((res) => {
	dataListyw.value = res.data
})

sjlist().then((res) => {
	dataListsj.value = res.data
})
cglist().then((res) => {
	dataListcg.value = res.data
})
gclist().then((res) => {
	dataListgc.value = res.data
})
</script>
<style lang="scss" scoped>
.header {
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	font-weight: 600;
	border-bottom: 2px rgba(240, 240, 240, 1) solid;
	margin-bottom: 5px;
}
.left-label {
	color: #33b6fe;
	height: 24px;
	line-height: 24px;
	position: relative;
	top: 1px;
	margin-right: 10px;
	display: inline-block;
	min-width: 80px;
}
:deep(.el-table__header) {
	background-color: #2f3f56;
}

.row3 {
	border-bottom: 1px rgba(240, 240, 240, 1) solid;
	padding: 5px 0 10px 0;
}
</style>
